<template>
  <div class="table-container">
    <bs-table showIndex :cols="cols" :tableData="tableData" :operations="operations" text-align="left">
				<template #busLogOperationTime="{ row }">
					{{ row.busLogOperationTime }}
				</template>

				<template #operations="{ row }">
					<el-link :underline="false" type="danger" style="margin-right:10px;">终止</el-link>
					<el-link :underline="false" type="primary">查看详情</el-link>
				</template>
		</bs-table>
    <bs-pagination
      class="pagination"
      :total="total"
      :page="pageData.page"
      :limit="pageData.limit"
      :showAllChecked="false"
      :allChecked="allSize"
      @current-change="currentChange"
      @size-change="sizeChange"
    ></bs-pagination>
  </div>
</template>

<script lang="ts" setup>
import { ref, onMounted } from "vue";
import axios from 'axios'
const pageData = ref({
  page:1,
  limit:10
})
const allSize = ref(false)
const currentChange = (val: number)=>{
   current.value = val;
  getData();
}
const sizeChange = (val: number)=>{
  pageSize.value = val;
  getData();
}
const operations = ref({
		show: true,
		align: 'left',
		width: '120px',
		label: '操作',
		slot: true,
		fixed: 'right',
	});
let cols = [
  {
    prop: "date",
    label: "日期",
  },
  {
    prop: "name",
    label: "名称",
  },
  {
    prop: "address",
    label: "地址",
  }
];
let tableData = ref<any[]>([]);

let current = ref<number>(1);
let pageSize = ref<number>(10);
let total = ref<number>(0);
let getData = async () => {
  let params = {
    current:current.value,
    pageSize:pageSize.value
  }
  const res : any = await axios.post('/api/list',params)
  console.log(res,'res==========')
  if(res && res.code == 200){
    tableData.value = res?.data?.rows || []
    total.value = res?.data?.total ?? 0
  }

};

onMounted(() => {
  getData();
});

let sure = (scope: any) => {
  console.log(scope);
};
let confirm = (scope: any) => {
  // console.log(scope)
};
</script>

<style lang="scss" scoped>
svg {
  width: 1em;
  height: 1em;
}
.table-container {
  background-color: #fff;
  padding: 10px;
}
.pagination{
  margin-top: 10px;
}
</style>
